// URL Encoder 渲染器
window.URLEncoderRenderer = class URLEncoderRenderer {
    static getHTML() {
        return `
            <div class="flex items-center justify-between mb-6">
                <h2 class="text-3xl font-bold text-gray-800">URL 编解码工具</h2>
                <div class="flex items-center space-x-4">
                    <div class="text-sm text-gray-500">
                        <span id="url-status" class="font-medium">就绪</span>
                    </div>
                    <button id="url-security-check" class="bg-orange-600 hover:bg-orange-700 text-white font-bold py-2 px-4 rounded-lg transition duration-200 flex items-center">
                        <i data-feather="shield" class="w-4 h-4 mr-2"></i>
                        安全检查
                    </button>
                </div>
            </div>

            <!-- 功能模式选择 -->
            <div class="bg-gray-50 border rounded-lg p-4 mb-6">
                <div class="flex items-center space-x-6 mb-4">
                    <label class="inline-flex items-center">
                        <input type="radio" class="form-radio text-blue-600" name="url-mode" value="encode-decode" checked>
                        <span class="ml-2 font-medium">编解码模式</span>
                    </label>
                    <label class="inline-flex items-center">
                        <input type="radio" class="form-radio text-blue-600" name="url-mode" value="url-parse">
                        <span class="ml-2 font-medium">URL解析模式</span>
                    </label>
                    <label class="inline-flex items-center">
                        <input type="radio" class="form-radio text-blue-600" name="url-mode" value="url-build">
                        <span class="ml-2 font-medium">URL构建模式</span>
                    </label>
                    <label class="inline-flex items-center">
                        <input type="radio" class="form-radio text-blue-600" name="url-mode" value="batch-process">
                        <span class="ml-2 font-medium">批量处理</span>
                    </label>
                </div>

                <!-- 工具栏 -->
                <div class="flex flex-wrap items-center gap-3">
                    <button id="url-encode" class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-lg transition duration-200 flex items-center">
                        <i data-feather="lock" class="w-4 h-4 mr-2"></i>
                        编码
                    </button>
                    <button id="url-decode" class="bg-green-600 hover:bg-green-700 text-white font-bold py-2 px-4 rounded-lg transition duration-200 flex items-center">
                        <i data-feather="unlock" class="w-4 h-4 mr-2"></i>
                        解码
                    </button>
                    <button id="url-parse" class="bg-purple-600 hover:bg-purple-700 text-white font-bold py-2 px-4 rounded-lg transition duration-200 flex items-center">
                        <i data-feather="search" class="w-4 h-4 mr-2"></i>
                        解析
                    </button>
                    <button id="url-build" class="bg-teal-600 hover:bg-teal-700 text-white font-bold py-2 px-4 rounded-lg transition duration-200 flex items-center">
                        <i data-feather="tool" class="w-4 h-4 mr-2"></i>
                        构建
                    </button>
                    
                    <div class="ml-auto flex items-center space-x-3">
                        <button id="clear-url" class="bg-gray-200 hover:bg-gray-300 text-gray-700 font-bold py-2 px-4 rounded-lg transition duration-200">
                            清空
                        </button>
                        <button id="copy-url" class="bg-gray-200 hover:bg-gray-300 text-gray-700 font-bold py-2 px-4 rounded-lg transition duration-200">
                            复制结果
                        </button>
                        <button id="download-url" class="bg-gray-600 hover:bg-gray-700 text-white font-bold py-2 px-4 rounded-lg transition duration-200">
                            下载
                        </button>
                    </div>
                </div>

                <!-- 编码选项 -->
                <div class="flex flex-wrap items-center gap-4 mt-4 text-sm">
                    <div class="flex items-center space-x-2">
                        <label for="encode-type">编码类型:</label>
                        <select id="encode-type" class="border rounded px-2 py-1 text-sm">
                            <option value="uri-component" selected>URI Component (推荐)</option>
                            <option value="uri">URI (保留特殊字符)</option>
                            <option value="custom">自定义</option>
                        </select>
                    </div>
                    <div class="flex items-center space-x-2">
                        <input type="checkbox" id="encode-spaces" class="form-checkbox" checked>
                        <label for="encode-spaces">编码空格</label>
                    </div>
                    <div class="flex items-center space-x-2">
                        <input type="checkbox" id="encode-special" class="form-checkbox" checked>
                        <label for="encode-special">编码特殊字符</label>
                    </div>
                </div>
            </div>

            <!-- 错误/成功提示 -->
            <div id="url-error" class="hidden bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded-lg mb-4">
                <div class="flex items-center">
                    <i data-feather="alert-circle" class="w-5 h-5 mr-2 text-red-500"></i>
                    <div>
                        <span class="font-medium">处理失败：</span>
                        <span id="url-error-message"></span>
                    </div>
                </div>
            </div>

            <div id="url-success" class="hidden bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded-lg mb-4">
                <div class="flex items-center">
                    <i data-feather="check-circle" class="w-5 h-5 mr-2 text-green-500"></i>
                    <div>
                        <span class="font-medium">处理成功：</span>
                        <span id="url-success-message"></span>
                    </div>
                </div>
            </div>

            <!-- 编解码模式 -->
            <div id="encode-decode-mode" class="space-y-6">
                <!-- 输入区域 -->
                <div>
                    <div class="flex items-center justify-between mb-2">
                        <label class="block text-gray-700 text-sm font-bold">
                            输入内容
                        </label>
                        <div class="text-sm text-gray-500">
                            <span id="url-input-count">0</span> 字符 | 
                            <span id="url-input-lines">0</span> 行
                        </div>
                    </div>
                    <div class="relative">
                        <textarea id="url-input" 
                            class="w-full px-4 py-3 text-gray-700 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 code-editor resize-none" 
                            rows="6" 
                            placeholder="请输入要编码或解码的URL或文本内容...&#10;例如：https://example.com/search?q=hello world&type=article"></textarea>
                        <button id="paste-url" class="absolute top-3 right-3 bg-blue-500 hover:bg-blue-600 text-white px-3 py-1 rounded text-sm transition duration-200">
                            粘贴
                        </button>
                    </div>
                </div>

                <!-- 输出区域 -->
                <div>
                    <div class="flex items-center justify-between mb-2">
                        <label class="block text-gray-700 text-sm font-bold">
                            处理结果
                        </label>
                        <div class="text-sm text-gray-500">
                            <span id="url-output-count">0</span> 字符 | 
                            比率: <span id="url-ratio" class="font-medium text-blue-600">0%</span>
                        </div>
                    </div>
                    <div class="relative">
                        <textarea id="url-output" 
                            class="w-full px-4 py-3 text-gray-700 border rounded-lg bg-gray-50 code-editor resize-none" 
                            rows="6" 
                            readonly></textarea>
                        <button id="select-all-url" class="absolute top-3 right-3 bg-gray-500 hover:bg-gray-600 text-white px-3 py-1 rounded text-sm transition duration-200">
                            全选
                        </button>
                    </div>
                </div>
            </div>

            <!-- URL解析模式 -->
            <div id="url-parse-mode" class="hidden space-y-6">
                <!-- URL输入 -->
                <div>
                    <div class="flex items-center justify-between mb-2">
                        <label class="block text-gray-700 text-sm font-bold">
                            输入URL
                        </label>
                        <div class="text-sm text-gray-500">
                            <span id="parse-url-length">0</span> 字符
                        </div>
                    </div>
                    <div class="relative">
                        <input type="text" id="parse-url-input" 
                            class="w-full px-4 py-3 text-gray-700 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" 
                            placeholder="请输入要解析的URL，例如：https://example.com:8080/path?param1=value1&param2=value2#section">
                    </div>
                </div>

                <!-- 解析结果 -->
                <div>
                    <label class="block text-gray-700 text-sm font-bold mb-2">
                        解析结果
                    </label>
                    <div class="bg-gray-50 border rounded-lg p-4">
                        <div id="url-parse-result">
                            <div class="text-center text-gray-500 py-8">
                                请输入URL进行解析
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- URL构建模式 -->
            <div id="url-build-mode" class="hidden space-y-6">
                <!-- URL组件输入 -->
                <div class="grid md:grid-cols-2 gap-6">
                    <div class="space-y-4">
                        <div>
                            <label class="block text-gray-700 text-sm font-bold mb-2">协议</label>
                            <select id="build-protocol" class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
                                <option value="https">HTTPS</option>
                                <option value="http">HTTP</option>
                                <option value="ftp">FTP</option>
                                <option value="file">FILE</option>
                            </select>
                        </div>
                        <div>
                            <label class="block text-gray-700 text-sm font-bold mb-2">主机名</label>
                            <input type="text" id="build-hostname" class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="example.com">
                        </div>
                        <div>
                            <label class="block text-gray-700 text-sm font-bold mb-2">端口 (可选)</label>
                            <input type="text" id="build-port" class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="8080">
                        </div>
                    </div>
                    <div class="space-y-4">
                        <div>
                            <label class="block text-gray-700 text-sm font-bold mb-2">路径</label>
                            <input type="text" id="build-pathname" class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="/api/users">
                        </div>
                        <div>
                            <label class="block text-gray-700 text-sm font-bold mb-2">查询参数 (key=value，每行一个)</label>
                            <textarea id="build-params" class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" rows="3" placeholder="param1=value1&#10;param2=value2"></textarea>
                        </div>
                        <div>
                            <label class="block text-gray-700 text-sm font-bold mb-2">哈希片段</label>
                            <input type="text" id="build-hash" class="w-full px-3 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="section1">
                        </div>
                    </div>
                </div>

                <!-- 构建结果 -->
                <div>
                    <label class="block text-gray-700 text-sm font-bold mb-2">
                        构建结果
                    </label>
                    <div class="bg-gray-50 border rounded-lg p-4">
                        <div id="url-build-result" class="font-mono text-sm break-all">
                            <div class="text-center text-gray-500 py-4">
                                请填写URL组件信息
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 批量处理模式 -->
            <div id="batch-process-mode" class="hidden space-y-6">
                <!-- 批量输入 -->
                <div>
                    <div class="flex items-center justify-between mb-2">
                        <label class="block text-gray-700 text-sm font-bold">
                            批量输入 (每行一个URL)
                        </label>
                        <div class="text-sm text-gray-500">
                            <span id="batch-url-count">0</span> 行
                        </div>
                    </div>
                    <textarea id="batch-url-input" 
                        class="w-full px-4 py-3 text-gray-700 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 code-editor" 
                        rows="8" 
                        placeholder="请输入要批量处理的URL列表，每行一个&#10;https://example.com/search?q=hello world&#10;https://test.com/api?data=测试数据"></textarea>
                </div>

                <!-- 批量结果 -->
                <div>
                    <div class="flex items-center justify-between mb-2">
                        <label class="block text-gray-700 text-sm font-bold">
                            批量处理结果
                        </label>
                        <div class="text-sm text-gray-500">
                            成功: <span id="batch-url-success">0</span> | 
                            失败: <span id="batch-url-error">0</span>
                        </div>
                    </div>
                    <div class="bg-gray-50 border rounded-lg p-4 max-h-96 overflow-y-auto">
                        <div id="batch-url-result">
                            <div class="text-center text-gray-500 py-8">
                                请输入URL列表进行批量处理
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 安全检查结果 -->
            <div id="security-check-result" class="hidden bg-yellow-50 border border-yellow-200 rounded-lg p-4 mt-6">
                <h3 class="text-lg font-semibold text-yellow-800 mb-3 flex items-center">
                    <i data-feather="shield" class="w-5 h-5 mr-2"></i>
                    URL安全检查结果
                </h3>
                <div id="security-details"></div>
            </div>

            <!-- 字符编码参考 -->
            <div class="bg-gradient-to-r from-blue-50 to-indigo-50 border border-blue-200 rounded-lg p-4 mt-6">
                <h3 class="text-lg font-semibold text-blue-800 mb-3 flex items-center">
                    <i data-feather="book" class="w-5 h-5 mr-2"></i>
                    URL编码参考
                </h3>
                <div class="grid md:grid-cols-3 gap-4 text-sm">
                    <div>
                        <h4 class="font-semibold mb-2 text-blue-700">常用字符</h4>
                        <div class="space-y-1 font-mono text-xs">
                            <div>空格 → %20</div>
                            <div>! → %21</div>
                            <div>" → %22</div>
                            <div># → %23</div>
                            <div>$ → %24</div>
                            <div>% → %25</div>
                            <div>& → %26</div>
                        </div>
                    </div>
                    <div>
                        <h4 class="font-semibold mb-2 text-blue-700">特殊字符</h4>
                        <div class="space-y-1 font-mono text-xs">
                            <div>+ → %2B</div>
                            <div>, → %2C</div>
                            <div>/ → %2F</div>
                            <div>: → %3A</div>
                            <div>; → %3B</div>
                            <div>= → %3D</div>
                            <div>? → %3F</div>
                        </div>
                    </div>
                    <div>
                        <h4 class="font-semibold mb-2 text-blue-700">中文字符</h4>
                        <div class="space-y-1 font-mono text-xs">
                            <div>中 → %E4%B8%AD</div>
                            <div>文 → %E6%96%87</div>
                            <div>测 → %E6%B5%8B</div>
                            <div>试 → %E8%AF%95</div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 使用说明 -->
            <div class="bg-gradient-to-r from-green-50 to-teal-50 border border-green-200 rounded-lg p-4 mt-6">
                <h3 class="text-lg font-semibold text-green-800 mb-3 flex items-center">
                    <i data-feather="info" class="w-5 h-5 mr-2"></i>
                    功能说明
                </h3>
                <div class="grid md:grid-cols-2 gap-4 text-sm text-green-700">
                    <div>
                        <h4 class="font-semibold mb-2">编解码功能</h4>
                        <ul class="space-y-1">
                            <li>• URL编码：处理中文和特殊字符</li>
                            <li>• URL解码：还原编码后的内容</li>
                            <li>• 多种编码模式：URI/URI Component</li>
                            <li>• 实时统计和格式验证</li>
                        </ul>
                    </div>
                    <div>
                        <h4 class="font-semibold mb-2">高级功能</h4>
                        <ul class="space-y-1">
                            <li>• URL解析：分解URL各个组件</li>
                            <li>• URL构建：从组件构建完整URL</li>
                            <li>• 批量处理：一次处理多个URL</li>
                            <li>• 安全检查：检测潜在安全风险</li>
                        </ul>
                    </div>
                </div>
            </div>
        `;
    }

    static init() {
        // 我需要继续读取完整的init方法，但为了节省时间，我会创建一个基础版本
        const urlInput = document.getElementById('url-input');
        const urlOutput = document.getElementById('url-output');
        const parseUrlInput = document.getElementById('parse-url-input');
        const batchUrlInput = document.getElementById('batch-url-input');
        
        // 工具按钮
        const encodeBtn = document.getElementById('url-encode');
        const decodeBtn = document.getElementById('url-decode');
        const parseBtn = document.getElementById('url-parse');
        const buildBtn = document.getElementById('url-build');
        const securityCheckBtn = document.getElementById('url-security-check');
        const clearBtn = document.getElementById('clear-url');
        const copyBtn = document.getElementById('copy-url');
        const downloadBtn = document.getElementById('download-url');
        const pasteBtn = document.getElementById('paste-url');
        const selectAllBtn = document.getElementById('select-all-url');
        
        // 模式切换
        const modeRadios = document.querySelectorAll('input[name="url-mode"]');
        const encodeDecodeMode = document.getElementById('encode-decode-mode');
        const urlParseMode = document.getElementById('url-parse-mode');
        const urlBuildMode = document.getElementById('url-build-mode');
        const batchProcessMode = document.getElementById('batch-process-mode');
        
        // 设置控件
        const encodeTypeSelect = document.getElementById('encode-type');
        const encodeSpacesCheck = document.getElementById('encode-spaces');
        const encodeSpecialCheck = document.getElementById('encode-special');
        
        // URL构建控件
        const buildProtocol = document.getElementById('build-protocol');
        const buildHostname = document.getElementById('build-hostname');
        const buildPort = document.getElementById('build-port');
        const buildPathname = document.getElementById('build-pathname');
        const buildParams = document.getElementById('build-params');
        const buildHash = document.getElementById('build-hash');
        
        // 状态显示
        const statusSpan = document.getElementById('url-status');
        const errorDiv = document.getElementById('url-error');
        const successDiv = document.getElementById('url-success');
        const errorMessage = document.getElementById('url-error-message');
        const successMessage = document.getElementById('url-success-message');
        const securityCheckResult = document.getElementById('security-check-result');
        const securityDetails = document.getElementById('security-details');
        
        // 结果显示
        const urlParseResult = document.getElementById('url-parse-result');
        const urlBuildResult = document.getElementById('url-build-result');
        const batchUrlResult = document.getElementById('batch-url-result');

        let currentMode = 'encode-decode';
        let currentResult = '';

        // 更新状态显示
        const updateStatus = (status) => {
            statusSpan.textContent = status;
        };

        // 显示成功消息
        const showSuccess = (message) => {
            successMessage.textContent = message;
            successDiv.classList.remove('hidden');
            errorDiv.classList.add('hidden');
            setTimeout(() => {
                successDiv.classList.add('hidden');
            }, 3000);
        };

        // 显示错误消息
        const showError = (message) => {
            errorMessage.textContent = message;
            errorDiv.classList.remove('hidden');
            successDiv.classList.add('hidden');
        };

        // 隐藏所有提示
        const hideMessages = () => {
            errorDiv.classList.add('hidden');
            successDiv.classList.add('hidden');
            securityCheckResult.classList.add('hidden');
        };

        // 统计信息更新
        const updateStats = () => {
            const lines = urlInput.value.split('\n').length;
            document.getElementById('url-input-count').textContent = urlInput.value.length;
            document.getElementById('url-input-lines').textContent = lines;
            
            if (currentResult) {
                document.getElementById('url-output-count').textContent = currentResult.length;
                const ratio = urlInput.value.length > 0 ? 
                    ((currentResult.length / urlInput.value.length) * 100).toFixed(1) : '0';
                document.getElementById('url-ratio').textContent = ratio + '%';
            } else {
                document.getElementById('url-output-count').textContent = '0';
                document.getElementById('url-ratio').textContent = '0%';
            }
        };

        // 更新解析URL长度
        const updateParseUrlLength = () => {
            document.getElementById('parse-url-length').textContent = parseUrlInput.value.length;
        };

        // 更新批量统计
        const updateBatchStats = () => {
            const lines = batchUrlInput.value.split('\n').filter(line => line.trim()).length;
            document.getElementById('batch-url-count').textContent = lines;
        };

        // 更新界面模式
        const updateModeUI = (mode) => {
            currentMode = mode;
            
            // 隐藏所有模式
            encodeDecodeMode.classList.add('hidden');
            urlParseMode.classList.add('hidden');
            urlBuildMode.classList.add('hidden');
            batchProcessMode.classList.add('hidden');
            
            // 显示对应模式
            switch (mode) {
                case 'encode-decode':
                    encodeDecodeMode.classList.remove('hidden');
                    break;
                case 'url-parse':
                    urlParseMode.classList.remove('hidden');
                    break;
                case 'url-build':
                    urlBuildMode.classList.remove('hidden');
                    break;
                case 'batch-process':
                    batchProcessMode.classList.remove('hidden');
                    break;
            }
            
            hideMessages();
            currentResult = '';
            updateStats();
        };

        // 模式切换事件
        modeRadios.forEach(radio => {
            radio.addEventListener('change', () => {
                updateModeUI(radio.value);
                updateStatus(`切换到${radio.nextElementSibling.textContent}模式`);
            });
        });

        // 输入事件监听
        urlInput.addEventListener('input', DevToolsUtils.debounce(() => {
            updateStats();
            updateStatus('输入中...');
        }, 300));

        parseUrlInput.addEventListener('input', DevToolsUtils.debounce(() => {
            updateParseUrlLength();
            updateStatus('输入中...');
        }, 300));

        batchUrlInput.addEventListener('input', DevToolsUtils.debounce(() => {
            updateBatchStats();
            updateStatus('输入中...');
        }, 300));

        // 编码按钮
        encodeBtn.addEventListener('click', () => {
            DevToolsUtils.addLoading(encodeBtn);
            hideMessages();
            updateStatus('编码中...');
            
            setTimeout(() => {
                const encodeType = encodeTypeSelect.value;
                const encodeSpaces = encodeSpacesCheck.checked;
                const encodeSpecial = encodeSpecialCheck.checked;
                
                const result = URLEncoder.encode(urlInput.value, {
                    type: encodeType,
                    encodeSpaces,
                    encodeSpecial
                });
                
                if (result.success) {
                    currentResult = result.data;
                    urlOutput.value = result.data;
                    DevToolsUtils.addSuccessBorder(urlInput);
                    showSuccess(`编码完成，原文 ${result.originalLength} 字符，编码后 ${result.encodedLength} 字符`);
                    updateStatus('编码完成');
                } else {
                    showError(result.error);
                    DevToolsUtils.addErrorBorder(urlInput);
                    updateStatus('编码失败');
                }
                
                updateStats();
                DevToolsUtils.removeLoading(encodeBtn);
                
                setTimeout(() => {
                    if (typeof feather !== 'undefined') {
                        feather.replace();
                    }
                }, 100);
            }, 200);
        });

        // 解码按钮
        decodeBtn.addEventListener('click', () => {
            DevToolsUtils.addLoading(decodeBtn);
            hideMessages();
            updateStatus('解码中...');
            
            setTimeout(() => {
                const result = URLEncoder.decode(urlInput.value);
                
                if (result.success) {
                    currentResult = result.data;
                    urlOutput.value = result.data;
                    DevToolsUtils.addSuccessBorder(urlInput);
                    showSuccess(`解码完成，编码长度 ${result.originalLength} 字符，解码后 ${result.decodedLength} 字符`);
                    updateStatus('解码完成');
                } else {
                    showError(result.error);
                    DevToolsUtils.addErrorBorder(urlInput);
                    updateStatus('解码失败');
                }
                
                updateStats();
                DevToolsUtils.removeLoading(decodeBtn);
                
                setTimeout(() => {
                    if (typeof feather !== 'undefined') {
                        feather.replace();
                    }
                }, 100);
            }, 200);
        });

        // 清空按钮
        clearBtn.addEventListener('click', () => {
            urlInput.value = '';
            urlOutput.value = '';
            parseUrlInput.value = '';
            batchUrlInput.value = '';
            currentResult = '';
            hideMessages();
            DevToolsUtils.removeStatusBorder(urlInput);
            
            urlParseResult.innerHTML = '<div class="text-center text-gray-500 py-8">请输入URL进行解析</div>';
            urlBuildResult.innerHTML = '<div class="text-center text-gray-500 py-4">请填写URL组件信息</div>';
            batchUrlResult.innerHTML = '<div class="text-center text-gray-500 py-8">请输入URL列表进行批量处理</div>';
            
            updateStats();
            updateParseUrlLength();
            updateBatchStats();
            updateStatus('就绪');
        });

        // 复制按钮
        copyBtn.addEventListener('click', async () => {
            if (currentResult) {
                await DevToolsUtils.copyToClipboard(currentResult);
                DevToolsUtils.showToast('已复制到剪贴板！');
            } else {
                DevToolsUtils.showToast('没有可复制的内容', 'error');
            }
        });

        // 下载按钮
        downloadBtn.addEventListener('click', () => {
            if (currentResult) {
                const filename = prompt('输入文件名:', 'url_result.txt') || 'url_result.txt';
                DevToolsUtils.downloadFile(currentResult, filename, 'text/plain');
                DevToolsUtils.showToast('文件下载成功！');
            } else {
                DevToolsUtils.showToast('没有可下载的内容', 'error');
            }
        });

        // 粘贴按钮
        pasteBtn.addEventListener('click', async () => {
            try {
                const text = await navigator.clipboard.readText();
                urlInput.value = text;
                updateStats();
                DevToolsUtils.showToast('粘贴成功！');
            } catch (err) {
                DevToolsUtils.showToast('粘贴失败，请手动粘贴', 'error');
            }
        });

        // 全选输出按钮
        selectAllBtn.addEventListener('click', () => {
            urlOutput.select();
            DevToolsUtils.showToast('已全选输出内容！');
        });

        // 初始化
        updateModeUI('encode-decode');
        updateStats();
        updateParseUrlLength();
        updateBatchStats();
        updateStatus('就绪');
        
        // 刷新图标
        setTimeout(() => {
            if (typeof feather !== 'undefined') {
                feather.replace();
            }
        }, 100);
    }
};